﻿<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title>splitPage</title>
    <!-- WinJS references -->
    <link rel="stylesheet" href="/winjs/css/ui-dark.css" />
    <script type="ms-deferred/javascript" src="/winjs/js/base.js"></script>
    <script type="ms-deferred/javascript" src="/winjs/js/ui.js"></script>
    <script type="ms-deferred/javascript" src="/winjs/js/binding.js"></script>
    <script type="ms-deferred/javascript" src="/winjs/js/controls.js"></script>
    <script type="ms-deferred/javascript" src="/winjs/js/animations.js"></script>
    <script type="ms-deferred/javascript" src="/winjs/js/uicollections.js"></script>
    <script type="ms-deferred/javascript" src="/winjs/js/wwaapp.js"></script>
    <link rel="stylesheet" href="/css/default.css" />
    <link rel="stylesheet" href="/css/splitPage.css" />
    <script type="ms-deferred/javascript" src="/js/splitPage.js"></script>
</head>
<body>
    <!-- This template is used to display each item in the ListView declared below. -->
    <div class="itemTemplate" data-win-control="WinJS.Binding.Template">
        <div class="largeIconTextTemplate">
            <div class="largeIconTextTemplateImage">
                <div data-win-bind="textContent: name">
                </div>
            </div>
            <div class="largeIconTextTemplateBackground">
                <div class="largeIconTextTemplateLargeText win-itemTextStrong" data-win-bind="textContent: name">
                </div>
                <div class="largeIconTextTemplateMediumText win-itemText" data-win-bind="textContent: desc">
                </div>
            </div>
        </div>
    </div>
    <!-- The content that will be loaded and displayed. -->
    <div class="splitPage fragment">
        <header role="banner" aria-label="Header content">
            <button disabled class="win-backbutton" aria-label="Back">
            </button>
            <h1 class="pageTitle win-title">
            </h1>
        </header>
        <section class="itemListSection">
            <div class="itemList" data-win-control="WinJS.UI.ListView" data-win-options="{dataSource: splitPage.items, oniteminvoked: splitPage.itemInvoked,  layout: {type: WinJS.UI.ListLayout}, selectionMode: 'none' }">
            </div>
        </section>
        <section class="articleSection" aria-live="assertive" aria-atomic="true" aria-label="Item detail">
            <header class="header">
                <h1 class="title win-contentTitle" data-win-bind="textContent: name">
                </h1>
                <div class="codeArea">
                    <textarea id="code" data-win-bind="textContent: source">
                    </textarea>
                </div>
                <div class="shareControls">
                    <input id="clear" type="reset" value="Clear" />
                    <input id="submit" type="submit" value="Run Code" />
                </div>
            </header>
            <div id="output">
            </div>
        </section>
    </div>
</body>
</html>
